<template>
    <div class="ChangeTable">
        <Row>
            <Col span="24">
                <Table
                    width="100%"
                    :columns="isSP ? contractTableHeadPartner : contractTableHead"
                    :data="contractTable.records"
                    :loading="loading"
                    border
                >
                    <!-- 放款状态 -->
                    <template slot-scope="{ row }" slot="creditStatus">
                        <span>{{getTitle('creditStatus',row.creditStatus)}}</span>
                    </template>
                    <!-- 来源 -->
                    <template slot-scope="{ row }" slot="businessSource">
                        <span>{{getTitle('businessSource',row.businessSource)}}</span>
                    </template>
                    <!-- 处理状态 -->
                    <template slot-scope="{ row }" slot="processStatus">
                        <span>{{getTitle('cancelProcessStatus',row.processStatus)}}</span>
                    </template>
                    <!-- 合同状态/合同申请状态 -->
                    <template v-if="!isSP" slot-scope="{ row }" slot="contractStatus">
                        <span>{{getTitle('contractStatus',row.contractStatus)}}</span>
                    </template>
                    <!-- 渠道类型 -->
                    <template v-if="!isSP" slot-scope="{ row }" slot="channelType">
                        <span>{{getTitle('channelBelong',row.channelType)}}</span>
                    </template>
                    <template slot-scope="{ row }" slot="action">
                        <!--
                            处理  isViewBtn ~~审核中 待补件 待补件审核~~
                            编辑 草稿
                            删除 草稿
                        -->
                        <Button :disabled="!row.isViewBtn" type="primary" size="small"
                                @click="showContractDetial('write',row)">处理
                        </Button>

                        <Button :disabled="row.processStatus !== 'draft'" type="primary" size="small"
                                @click="showContractDetial('write',row)">编辑
                        </Button>

                        <Button :disabled="row.processStatus !== 'draft'" type="error" size="small"
                                @click="remove(row)">
                            删除
                        </Button>
                    </template>
                    <template slot="applyNo" slot-scope="{ row }">
                        <a @click="showContractDetial('read',row)">{{row.applyNo}}</a>
                    </template>
                </Table>
            </Col>
            <Col span="24">
                <Row type="flex" justify="end" class="table-page">
                    <Page
                        :current="contractTable.current"
                        :transfer="true"
                        :total="contractTable.total"
                        :page-size="contractTable.size"
                        @on-change="changePage"
                        @on-page-size-change="changePageSize"
                        :page-size-opts="pageSizeOpts"
                        size="small"
                        show-total
                        show-elevator
                        show-sizer
                    ></Page>
                </Row>
            </Col>
        </Row>
    </div>
</template>
<script>
    import {delById} from "_p/basic/api/contract/contract-cancel/index";
    import {getTitleFromDataDict} from "_p/basic/assets/contract/js/utils";

    export default {
        props: {
            formValidate: {
                type: Object,
                required: true
            },
            dataDict: {
                type: Object
            },
            contractTable: {
                type: Object,
                required: true
            },
            isSP: {
                type: Boolean,
                required: true,
                default: true
            }
        },
        data() {
            return {
                sizeChanging: false,
                pageNo: 1,
                loading: false,
                pageSizeOpts: [10, 20, 50, 100],
                contractTableHead: [
                    {
                        title: "操作",
                        slot: "action",
                        align: "center",
                        fixed: 'left',
                        width: 180
                    },
                    {
                        title: "合同号",
                        key: "contractNo",
                        minWidth: 150,
                        fixed: 'left',
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.contractNo,
                                    transfer: true
                                }
                            }, [h('a', {
                                class: 'contractNo',
                                style: {
                                    width: (params.column._width - 38) + 'px',
                                },
                                on: {
                                    click: () => {
                                        this.showContractDetial('read', params.row)
                                    }
                                }
                            }, params.row.contractNo)])
                        }
                    },
                    {
                        title: "客户姓名",
                        key: "custName",
                        ellipsis: true,
                        fixed: 'left',
                        tooltip: true,
                        minWidth: 150
                    },
                    {
                        title: "合同激活时间",
                        key: "startDate",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 150
                    },
                    {
                        title: "放款状态",
                        key: "creditStatus",
                        slot: "creditStatus",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 150

                    },
                    {
                        title: "合同状态",
                        key: "contractStatus",
                        slot: "contractStatus",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 150
                    },
                    {
                        title: "处理状态",
                        key: "processStatus",
                        slot: "processStatus",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 120
                    },
                    {
                        title: "申请时间",
                        key: "applyDate",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 150
                    },

                    {
                        title: "结束时间",
                        key: "endDate",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 150
                    },
                    {
                        title: "渠道归属",
                        key: "channelType",
                        slot: "channelType",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 150
                    },
                    {
                        title: "合作商名称",
                        key: "channelFullName",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 150
                    },
                    {
                        title: "来源",
                        key: "businessSource",
                        slot: "businessSource",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 120
                    },
                    {
                        title: "申请编号",
                        key: "applyNo",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 150,
                    }
                ],
                contractTableHeadPartner: [
                    {
                        title: "操作",
                        slot: "action",
                        align: "center",
                        width: 180
                    },
                    {
                        title: "申请编号",
                        key: "applyNo",
                        // slot: "applyNo",
                        minWidth: 150,
                        render: (h, params) => {
                            return h('Tooltip', {
                                props: {
                                    content: params.row.applyNo,
                                    transfer: true
                                }
                            }, [h('a', {
                                class: 'applyNo',
                                style: {
                                    width: (params.column._width - 38) + 'px',
                                },
                                on: {
                                    click: () => {
                                        this.showContractDetial('read', params.row)
                                    }
                                }
                            }, params.row.applyNo)])
                        }
                    },
                    {
                        title: "客户姓名",
                        key: "custName",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 120
                    },

                    {
                        title: "合同激活时间",
                        key: "startDate",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 150
                    },
                    {
                        title: "放款状态",
                        key: "creditStatus",
                        slot: "creditStatus",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 150
                    },
                    {
                        title: "处理状态",
                        key: "processStatus",
                        slot: "processStatus",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 150
                    },

                    {
                        title: "申请时间",
                        key: "applyDate",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 150
                    },
                    {
                        title: "结束时间",
                        key: "endDate",
                        ellipsis: true,
                        tooltip: true,
                        minWidth: 150
                    }
                ]
            };
        },
        mounted() {
            this.init();
        },
        methods: {
            init() {
            },
            // 分页 Fn
            changePageSize(v) {
                this.formValidate.pageSize = v;
                this.formValidate.pageNumber = 1;
                this.sizeChanging = true;
                this.$emit("getList", this.formValidate)
            },
            changePage(v) {
                this.formValidate.pageNumber = v;
                if (this.sizeChanging) {
                    return;
                }
                this.$emit("getList", this.formValidate)
            },
            remove(v) {
                this.$Modal.confirm({
                    title: "确认删除",
                    content: "您确认要删除单号 " + v.applyNo + " ?",
                    onOk: () => {
                        delById(v.id).then(res => {
                            if (res.code === "0000") {
                                this.$Message.success(res.msg);
                                this.$emit("getList", this.formValidate);
                            }
                        });
                    }
                });
            },
            showContractDetial(type, params) {
                // let id = params.contractNo ? params.contractNo : "0";
                params.editFlag = true;
                params.type = type;
                this.afs.newTab(
                    this,
                    "projects/basic/pages/contract/contract-cancellation/contract-cancellation-detial/index",
                    "合同取消详情",
                    "ios-add",
                    params,
                    "contract-cancellation-detial-" + this.pageNo,
                    [],
                    true
                );
                this.pageNo += 1;
            },
            getTitle(type, val) {
                let data = this.dataDict[type + "Dict"] || [];
                return getTitleFromDataDict(data, val);
            }
        },
        computed: {}
    };
</script>
<style scoped>
    .page {
        padding-top: 16px;
    }
</style>
